<template>
    <div class="drawer-title">
        <div class="back">
            <span>{{ title }}</span>
        </div>
        <i class="el-icon-close close" @click="closeDrawer"></i>
    </div>
</template>
<script>
export default {
    props: {
        title: {
            type: String,
            default: ""
        },
        
    },
    methods:{
        closeDrawer(){
            this.$emit("closeDrawer");
        }
    }
}
</script>
<style lang="less" scoped>
.drawer-title {
    padding: 0 20px;
    background-color: #ecf1fa;
    height: 77px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;

    .back {
        font-size: 18px;
        font-weight: 500;
        color: #1D2129;
        cursor: pointer;
    }

    i {
        color: #1D2129;
        cursor: pointer;
    }

    .close {
        font-size: 26px;
        right: 0;
    }
}
</style>